<template>
    <el-form :model="{}">
        <el-form-item label="代码文件根路径">{{ root }}</el-form-item>
        <el-table ref="table" :data="tableList" row-key="path" border stripe>
            <el-table-column label="选择" type="selection" width="60" align="center"/>
            <el-table-column label="类型" prop="type" width="130" align="center"/>
            <el-table-column label="文件">
                <template #default="{row}">
                    <div class="flex-v-center">
                        <tnxel-icon class="text-warning" value="Warning" title="已存在，保存时将覆盖" v-if="row.exists"/>
                        <tnxel-icon class="text-success" value="CirclePlus" title="不存在，保存时将新建" v-else/>
                        <div class="ms-1">{{ row.relativePath }}</div>
                    </div>
                </template>
            </el-table-column>
        </el-table>
    </el-form>
</template>

<script>
import tnx from '@/tnx';
import ModelingApp from '@/logic/modeling/entity/ModelingApp.js';

export default {
    props: {
        app: {
            type: ModelingApp,
            required: true,
        },
        files: Array,
        done: Function,
    },
    data() {
        return {
            tableList: [],
        };
    },
    computed: {
        root() {
            return tnx.util.file.getParentDir(this.app.path);
        },
    },
    mounted() {
        let total = 0;
        for (let file of this.files) {
            if (file.path) {
                tnx.util.file.exists(file.path).then(exists => {
                    this.tableList.push(Object.assign({}, file, {
                        exists,
                        relativePath: file.path.substring(this.root.length),
                    }));
                    if (++total === this.files.length) {
                        this.$nextTick(() => {
                            this.$refs.table.toggleAllSelection();
                        });
                    }
                });
            } else {
                total++;
            }
        }
    },
    methods: {
        dialog() {
            return {
                title: '确认保存代码到文件',
                width: 960, // 与generate-code保持一致
                type: 'confirm',
                click: this.toSubmit,
            }
        },
        toSubmit(yes, close) {
            if (yes) {
                let files = this.$refs.table.getSelectionRows();
                let total = 0;
                for (let file of files) {
                    tnx.util.file.write(file.path, file.code).then(() => {
                        if (++total === files.length) {
                            tnx.toast(`共 ${total} 个文件保存成功`, 2000);
                            close();
                            this.done(true);
                        }
                    }).catch(error => {
                        tnx.error(error);
                    });
                }
                return false;
            } else {
                this.done(false);
            }
        },
    }
}
</script>

<style lang="scss" scoped>

</style>
